/**
 * Created by zhanglihe on 15/9/9.
 */
require.config(require_config);

define([
    'jquery',
    'common',
    'ready',
    'template',
    'collection',
    'model',
    'dialog'
], function ($, common, ready, template, Collection, Model, dialog) {

    var index = function () {
        this.init();
    };
    var menu_type = 9;
    index.prototype = {
        init: function () {
            loading();
            this.event();
            this.fetch();
        },

        fetch: function (_args) {
            var args = _args || {};
            args.limit = 100;
            args.offset = 0;
            var _this = this;
            this.collection = new Collection({
                container: 'data-list',
                template: 'data-item',
                url: _global.url.api + 'menus',
                condition: args,
                model: {
                    tag_name: 'tr',
                    url: {
                        put: _global.url.api + 'menu/{id}',
                        post: _global.url.api + 'menu'
                    },
                    event: {
                        '.item-edit:click': 'edit',
                        '.item-remove:click': 'remove',
                        '.item-edit-listorder:change': 'edit_listorder',
                        '.item-add:click': 'add_menu'
                    },
                    remove: function (e) {
                        e.preventDefault();
                        var __this = this;
                        dialog({
                            content: '确认要删除菜单吗?',
                            ok: function (e) {
                                __this.data.act = 'remove';
                                if (__this.put()) {
                                    //重新加载
                                    _this.collection.reload();
                                }
                            }, cancel: function () {
                            }
                        }).show(e.target);
                    },
                    edit_listorder: function (e) {
                        e.preventDefault();
                        var __this = this;
                        var _id = __this.data.id;
                        __this.data.listorder = $('input[name="menu-listorder-' + _id + '"]').val();
                        __this.put();
                    },
                    add_menu: function (e) {
                        e.preventDefault();
                        var __this = this;
                        var _item = __this.data;
                        __this.data = {};
                        dialog({
                            title: '增加[' + _item.name + ']子菜单',
                            width: 500,
                            content: template('add-tpl', {'parent_id': _item.id, 'parent_name': _item.name}),
                            ok: function () {
                                __this.data.type = menu_type;
                                __this.data.status = $('input[name="status"]').is(':checked') ? 1 : 0;
                                __this.data.parent_id = $('input[name="parent_id"]').val();
                                console.log(__this.data);

                                if (!__this.post()) {
                                    console.log('put false');
                                    return false;
                                }
                                _this.collection.reload();
                            }, cancel: function () {
                                //重新加载
                                _this.collection.reload();
                            }
                        }).show();
                        //绑定表单元素更改事件
                        $('input, select, textarea').on('change', function (e) {
                            __this.change(e);
                        });
                    },
                    edit: function (e) {
                        e.preventDefault();
                        var __this = this;
                        dialog({
                            title: '编辑菜单：' + __this.data.name,
                            width: 500,
                            content: template('add-tpl', __this.data),
                            ok: function () {
                                __this.data.type = menu_type;
                                __this.data.status = $('input[name="status"]').is(':checked') ? 1 : 0;
                                __this.data.status = $('input[name="status"]').is(':checked') ? 1 : 0;
                                console.log(__this.data);

                                if (!__this.put()) {
                                    console.log('put false');
                                    return false;
                                }
                            }, cancel: function () {
                                //重新加载
                                //_this.collection.reload();
                            }
                        }).show();
                        //绑定表单元素更改事件
                        $('input, select, textarea').on('change', function (e) {
                            __this.change(e);
                        });
                    },
                    change: function (e) {
                        this.data[$(e.target).attr('name')] = $(e.target).val();
                    }
                },
                callback: function () {
                    loaded();
                },
                render_item: function (key, item) {
                    $.extend(this.model, {
                        data: item,
                        template: this.template
                    });
                    this.models[item.id] = new Model(this.model);
                    this.models[item.id].create_element();
                    if (item.parent_id > 0) {
                        var pid = this.models[item.parent_id]['last_id'] ? this.models[item.parent_id]['last_id'] : item.parent_id;
                        this.models[pid].el.after(this.models[item.id].el);
                        this.models[item.parent_id]['last_id'] = item.id;
                    } else {
                        this.el.append(this.models[item.id].el);
                    }
                }
            });
            this.collection.fetch();
        },

        event: function () {
            var _this = this;
            /**
             * 添加事件
             */
            $('#btn-status').on('click', 'a', function (e) {
                e.preventDefault();
                menu_type = $(this).attr('rel');
                var _args = {};
                _args.type = menu_type;
                _this.fetch(_args);
                $(this).addClass('active').siblings().removeClass('active');
            });
            $('#btn_add_menu').on('click', function (e) {
                _this.data = {}; ////表单临时变量
                e.preventDefault();

                dialog({
                    title: '添加菜单',
                    width: 500,
                    content: template('add-tpl'),
                    ok: function () {
                        _this.data.type = menu_type;
                        _this.data.status = $('input[name="status"]').is(':checked') ? 1 : 0;
                        console.log(_this.data);

                        if (!new Model({
                                url: _global.url.api + 'menu',
                                data: _this.data,
                                valid_config: {
                                    name: 'required',
                                    alias: 'required'
                                }
                            }).post()) {
                            return false;
                        }
                        //重新加载
                        _this.collection.reload();
                    }, cancel: function () {
                    }
                }).show();
                //绑定表单元素更改事件
                $('input, select, textarea').on('change', function (e) {
                    _this.change(e);
                });
            });
        },
        change: function (e) {
            this.data[$(e.target).attr('name')] = $(e.target).val();
        }

    };

    new index();

});